<template>
	<view>
		<view class="content" v-if="!$status">
			<view class="search">
				<u-search @search="getList(false)" @custom="getList(false)" placeholder="关键字搜索" v-model="keyword" :show-action="true" bg-color="#F6F6F6"></u-search>
			</view>
			<view class="info_box">
				<view class="item" v-for="(item, index) in list" :key="index">
					<view class="to_right" @click="!$status && $to('/pages/detailed/detailed?id=' + item.u_id)">
						<view class="outimg"><u-avatar :src="item.outimg" size="90" mode="square" :show-sex="true" :sex-icon="item.gender == 0 ? 'man' : 'woman'"></u-avatar></view>
						<view class="head">
							<view class="head_left">
								<view class="title">{{ item.name }}</view>
								<view class="date">
									<view class="authority" v-if="item.authority">{{ item.authority }}</view>
									{{ item.create_time }}
								</view>
							</view>
							<view class="head_right" v-if="!$status">
								详情
								<u-icon name="arrow-right"></u-icon>
							</view>
						</view>
					</view>
					<view class="l_t">
						<view class="left">个人介绍</view>
						<view class="right">{{ item.description }}</view>
					</view>
				</view>
			</view>
			<u-loadmore v-show="list.length < pagination.total" :status="loadStatus"></u-loadmore>
			<view v-show="list.length < pagination.limit" class="textCenter">共搜索到 {{ list.length }} 条数据</view>
		</view>
		<view style="padding: 20rpx;background-color: #fff;" v-else>
			<u-collapse>
				<u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index">
					<view v-html="item.body"></view>
				</u-collapse-item>
			</u-collapse>
		</view>
		<u-tabbar height="110rpx" v-model="current" :list="tabbar.list" :active-color="tabbar.active_color" :inactive-color="tabbar.inactive_color"></u-tabbar>
	</view>
</template>

<script>
import { public_user_list } from '@/api/index.js';
import tabbar from '@/tabbar.js';
export default {
	data() {
		return {
			itemList: [
				{
					head: '人生格言',
					body: `1.冰冻三尺，非一日之寒，成大事者不拘小节。<br><br>
					
2.一份耕耘，一份收获。<br><br>

3.人生就像一杯茶，不会苦一辈子，但总会苦一阵子。<br><br>

4.盛年不重来，一日难再晨，及时宜自勉，岁月不待人。<br><br>

5.世界总是一样的，只是我们的心情和遭遇不一样而已。<br><br>

6.待人退一步，爱人宽一寸，人生自然活得很快乐。<br><br>

7.如果做某一件事能给我带来好心情，那么无论遇到什么样的挫折，我都会竭力去做。<br><br>

8.过程用心，结果随缘。<br><br>

9.有多大的思想，才有多大的能量。<br><br>

10.时间顺流而下，生活逆水行舟。<br><br>

11.喜欢一个人，就该让他(她)快乐。<br><br>

12.一个胜利者不会放弃，而一个放弃者永远不会胜利。<br><br>

13.成功永远属于那些爱拼搏的人。<br><br>

14.有理想在的地方，地狱就是天堂。有希望在的地方，痛苦也成欢乐。<br><br>

15.相信自己，你能行!<br><br>

16.最好的，不一定是最合适的;最合适的，才是真正最好的。<br><br>

17.尽自己最大的努力，抱最大的希望，作最坏的打算。<br><br>

18.学会下一次进步，是做大自己的有效法则。因此千万不要让自己睡在已有的成功温床上。<br><br>

19.只要努力抬起你的双脚，胜利将属于你。<br><br>

20.脚下的路还很长，活着就要坚决走下去。`,
					open: true
				},
				{
					head: '人生格言2',
					body: `1.世间成事，不求其绝对圆满，留一份不足，可得无限美好。<br><br>

2.不论你在什么时候开始，重要的是开始之后就不要停止;不论你在什么时候结束，重要的是结束之后就不要悔恨。<br><br>

3.敢于面对现实，勇于承担责任，才会不断进步。<br><br>

4.经验是由痛苦中粹取出来的。<br><br>

5.自信是成功的前提，勤奋是成功的催化剂。<br><br>

6.只要目标向前，你可以到任何的地方。<br><br>

7.别人光鲜的背后或者有着太多不为人知的痛苦<br><br>

8.人若软弱就是自己最大的敌人;人若勇敢就是自己最好的朋友。<br><br>

9.山顶对我们半山腰的人来说并不遥远。<br><br>

10.成功永远属于一直在跑的人。<br><br>

11.功成由勤，业精于勤。<br><br>

12.记住该记住的，忘记该忘记的。改变能改变的，接受不能改变的。<br><br>

13.有努力就会成功!<br><br>

14.如果我们都去做自己能力做得到的事，我们真会叫自己大吃一惊。<br><br>

15.生命太过短暂，今天放弃了明天不一定能得到。<br><br>

16.每一发奋努力的背后，必有加倍的赏赐。<br><br>

17.要勇于承认自己所犯的错误，并承担其带来的责任。<br><br>

18.溪流的秀美是因为它脚下的路坎坷不平。<br><br>

19.若能像看别人的缺点一样，如此准确的发现自己的缺点，你的生命将会变的不平凡。<br><br>

20.上有天，下有地，中间站着你自己，做一天人，尽一天人事儿。<br><br>

21.爱一个人而那个人不爱你是很让人难受的，但更痛苦的是，爱一个人，却永远都没勇气告诉他。<br><br>

22.爱情是以微笑开始，以吻生长，以泪结束。<br><br>

23.人生的道路不会一帆风顺，事业的征途也充满崎岖艰险，只有奋斗，只有拼搏，才会达到成功的彼岸。<br><br>

24.如果你是一匹千里马，那么请做自己的伯乐。<br><br>

25.成功不是得到多少东西，而是把身上多余的东西的扔掉多少。<br><br>

26.用爱心来做事，用感恩的心做人。<br><br>

27.生命之长短殊不重要，只要你活得快乐，在有生之年做些有意义的事，便已足够。<br><br>

28.没有灯的小路一样可以行走，只要心还在。<br><br>

29.如果我们可以改变情绪，我们就可以改变未来。<br><br>

30.在成功的道路上，激情是需要的，志向是可贵的，但更重要的是那毫无情趣的近乎平常的坚守的毅力和勇气。`,
					open: false
				}
			],
			share: {
				title: '公开用户'
			},
			current: 1,
			tabbar: tabbar,
			keyword: '', //搜索的文字
			list: [],
			pagination: {
				limit: 20, //一页几条
				page: 1, //第几页
				total: 0
			},
			loadStatus: 'loadmore'
		};
	},
	onPullDownRefresh() {
		//下拉刷新
		this.getList();
	},
	onReachBottom() {
		this.loadStatus = 'loading';
		setTimeout(() => {
			if (this.pagination.total == this.list.length) {
				this.loadStatus = 'nomore';
			} else {
				this.getList(true);
			}
		}, 800);
	},
	onLoad() {
		this.getList();
		uni.$on('update_user_info', () => {
			console.log('刷新');
			this.getList();
		});
	},
	methods: {
		getList(status = false) {
			if (this.$status) {
				return;
			}
			//公共用户列表
			if (status) {
				this.pagination.page += 1;
			} else {
				this.pagination.page = 1; //重新加载
			}
			public_user_list({
				...this.pagination,
				name: this.keyword
			}).then(res => {
				console.log(res, '公共用户列表');
				this.pagination.total = res.data.total;
				uni.stopPullDownRefresh(); //关闭下拉刷新ss
				if (status) {
					//是否继续加载
					res.data.data.forEach(item => {
						this.list.push(item);
					});
				} else {
					this.list = res.data.data;
				}
			});
		}
	}
};
</script>
<style>
page {
	background-color: #f5f6f8;
}
</style>
<style lang="scss" scoped>
.content {
	padding-bottom: 20rpx;
	.info_box {
		padding: 110rpx 20rpx 20rpx;

		.item {
			padding: 40rpx;
			border-radius: 15rpx;
			background-color: #fff;
			margin-bottom: 20rpx;

			.to_right {
				display: flex;
				padding-bottom: 15rpx;
				border-bottom: 1rpx solid #f8f8f8;
				.outimg {
					padding-right: 25rpx;
					font-size: 0;
				}
				.head {
					flex: 1;
					display: flex;
					.head_left {
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						.title {
							font-weight: 600;
						}
						.date {
							color: #878d99;
						}
					}
					.head_right {
						margin-left: auto;
					}

					.right {
						margin-left: auto;
					}
				}
			}

			.l_t {
				line-height: 2;
				display: flex;

				.left {
					white-space: nowrap;
				}

				.right {
					margin-left: auto;
					padding-left: 40rpx;
					white-space: nowrap;
					font-weight: 300;
					text-overflow: ellipsis;
					overflow: hidden;
				}
			}
		}
	}
}
</style>
